import React, { useState, useEffect } from 'react'
import { withRouter } from 'react-router-dom'
import { Button, Table, Popconfirm, message, Tooltip, Modal } from 'antd';
import api from '../../../api/activityManage'

const RecordList = ({showModal,setShowModal}) => {
    
    const [state, setState] = useState({
        searchData: {
            page: 1,
            rows: 10
        },
        dataList:[],//列表
        dataListTotal:0,//列表总数
    });

    //更新state
    const updateState = (newState) => {
        let data = JSON.parse(JSON.stringify(state))
        setState(Object.assign({}, data, newState))
    }
    useEffect(()=>{
        if(showModal.visible){
            state.searchData.tpUserId = showModal.data.id
            getList()
        }
    },[showModal])
    //积分
    const integralColumns = [
        { title: '积分变化', dataIndex: 'changePoints', key: 'changePoints', width: 80, },
        { title: '积分结果', dataIndex: 'resPoints', key: 'resPoints', },
        { title: '积分信息', dataIndex: 'remark', key: 'remark', },
        { title: '时间', dataIndex: 'createTime', key: 'createTime', },
    ];
    //奖品
    const giftColumns = [
        { title: '兑换奖品', dataIndex: 'goodsName', key: 'goodsName', width: 80, },
        { title: '收件人姓名', dataIndex: 'userName', key: 'userName', },
        { title: '收件人地址', dataIndex: 'addr', key: 'addr', },
        { title: '联系手机', dataIndex: 'phone', key: 'phone', },
        { title: '时间', dataIndex: 'createTime', key: 'createTime', },
    ];
    const pageObj = {// 表格分页对象
        size: "small",
        total: state.dataListTotal,
        pageSize: state.searchData.rows,
        showSizeChanger: true,
        showQuickJumper: true,
        showTotal: () => `共 ${state.dataListTotal} 条`,
        onChange: (page) => {
            getList({page:page})
        },
        onShowSizeChange: (page, rows) => {
            getList({1:page,rows:rows})
        }
    }
    // 获取列表
    const getList = (data)=>{
        let obj = Object.assign({},state.searchData,data?data:{})
        let type = ''
        if(showModal.type==1){//type:1-积分；2-奖品
            type = 'getUserIntegralList'
        }else{
            type = 'getUserGiftList'
        }
        api[type](obj,(res)=>{
            console.log(res)
            updateState({
                searchData:obj,
                dataList:res.recordList,
                dataListTotal:res.totalCount
            })
        })
    }
    const closeModal = ()=>{
        setShowModal(1,false,{})
        updateState({
            searchData:{
                page:1,
                rows:30
            }
        })
    }
    return (
        <Modal title={showModal.type==1?'积分记录':'兑换奖品记录'}
            visible={showModal.visible}
            footer={null}
            onCancel={closeModal}
        >
            <Table
                columns={showModal.type==1?integralColumns:giftColumns}
                dataSource={state.dataList}
                pagination={pageObj}
                rowKey="id"
                scroll={{y:500}}
            />
        </Modal>
    )
}

export default withRouter(RecordList)